/*
  布局示例
  模仿设置界面
 */

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Example",
      home: Scaffold(
        appBar: AppBar(
          title: Text("LayoutExample"),
        ),
        body: Container(
          color: Colors.grey[100],
          child: Column(
            children: [
              Container(
                color: Colors.white,
                padding: const EdgeInsets.all(8.0),
                child: Row(
                  children: [
                    Icon(Icons.wifi, color: Colors.lightBlue),
                    Expanded( // 填充剩余空间
                      child: Padding(
                        padding: const EdgeInsets.only(left: 8.0),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,  // 主轴方向居中
                          crossAxisAlignment: CrossAxisAlignment.start, // 副轴方向左对齐
                          children: [
                            Text('网络和互联网', style: TextStyle(fontSize: 16, color: Colors.black), textDirection: TextDirection.ltr,),
                            Text('WLAN、移动网络、流量使用', textDirection: TextDirection.ltr, style: TextStyle(fontSize: 14, color: Colors.grey[700]), maxLines: 1, overflow: TextOverflow.ellipsis,)
                          ],
                        ),
                      ),
                    ),
                    Checkbox(value: true,
                        onChanged: (checked){
                          // 切换状态事件监听
                          print('check changed');
                        })
                  ],
                ),
              )
            ],
          ),
        )
      ),
    );
  }

}